@extends('layouts.base')
@section('title', '首页')
@section('content')    
<!-- ============================================================== -->
<!-- Container fluid  -->
<!-- ============================================================== -->
<style>
    .text-muted {color: #FFFFFF !important;}
</style>
<div class="container-fluid">
    <!-- ============================================================== -->
    <!-- Bread crumb and right sidebar toggle -->
    <!-- ============================================================== -->
    <div class="row page-titles">
        <div class="col-md-5 align-self-center">
            <h3 class="text-themecolor"></h3>
        </div>
        <div class="col-md-7 align-self-center">
            <ol class="breadcrumb">
                <li class="breadcrumb-item"><a href="javascript:void(0)">首页</a></li>
                <li class="breadcrumb-item">应用程序</li>
                <li class="breadcrumb-item active">数据仪表板</li>
            </ol>
        </div>
    </div>
    <style>
    .card-no-border .card {background: #F4F4F6;}
    .card-body {background: #FFFFFF;border-radius:20px;}
    </style>
    <!-- ============================================================== -->
    <!-- End Bread crumb and right sidebar toggle -->
    <!-- ============================================================== -->

    <!-- ============================================================== -->
    <!-- Stats box -->
    <!-- ============================================================== -->
    <div class="row" style="background: #F4F4F6;">
        <div class="col-md-12">
            <div class="card"><div class="card-body" style="background: #F4F4F6;"><div class="d-flex"><div><h3 class="card-title m-b-5"><span class="lstick"></span>首页仪表板</h3></div></div></div></div>
        </div>
    </div>
    <div class="row" style="background: #F4F4F6;">
        <div class="col-lg-3">
            <div class="card">
                <div class="card-body">
                    <div class="d-flex">
                        <div class="m-r-20 align-self-center"><img src="{{ asset('/assets/ot/images/shouru.png') }}" style="width:90px;"; /></div>
                        <div class="align-self-center" style="font-weight: bold;color: #fff;text-align:center;">
                            <h4 class="text-muted m-t-10 m-b-0"><span style="color:#000">今日收入(元)</span></4>
                            <h4 class="text-muted m-t-10 m-b-0"><span style="color:#000">￥@if(!$todayOrderTotalPrice)0.00 @else{{$todayOrderTotalPrice}}@endif</span></h4>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <div class="col-lg-3">
            <div class="card">
                <div class="card-body">
                    <div class="d-flex">
                        <div class="m-r-20 align-self-center"><img src="{{ asset('/assets/ot/images/dingdan.png') }}" style="width:90px;"; /></div>
                        <div class="align-self-center" style="font-weight: bold;color: #fff;text-align:center;">
                            <h4 class="text-muted m-t-10 m-b-0"><span style="color:#000">今日订单(笔)</span></h4>
                            <h4 class="text-muted m-t-10 m-b-0"><span style="color:#000">{{$todayOrders}}</span></h4>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <div class="col-lg-3">
            <div class="card">
                <div class="card-body">
                    <div class="d-flex">
                        <div class="m-r-20 align-self-center"><img src="{{ asset('/assets/ot/images/shouru.png') }}" style="width:90px;"; /></div>
                        <div class="align-self-center" style="font-weight: bold;color: #fff;text-align:center;">
                            <h4 class="text-muted m-t-10 m-b-0"><span style="color:#000">本月收入(元)</span></h4>
                            <h4 class="text-muted m-t-10 m-b-0"><span style="color:#000">￥@if(!$moonOrderTotalPrice)0.00 @else {{$moonOrderTotalPrice}}@endif</span></h4>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <div class="col-lg-3">
            <div class="card">
                <div class="card-body">
                    <div class="d-flex">
                        <div class="m-r-20 align-self-center"><img src="{{ asset('/assets/ot/images/dingdan.png') }}" style="width:90px;"; /></div>
                        <div class="align-self-center" style="font-weight: bold;color: #fff;text-align:center;">
                            <h4 class="text-muted m-t-10 m-b-0"><span style="color:#000">本月订单(笔)</span></h4>
                            <h4 class="text-muted m-t-10 m-b-0"><span style="color:#000">{{$moonOrders}}</span></h4>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <!-- ============================================================== -->
    <!-- Sales overview chart -->
    <!-- ============================================================== -->

    <div class="row" style="background: #F4F4F6;">
        <div class="col-md-12">
            <div class="card"><div class="card-body" style="background: #F4F4F6;"><div class="d-flex"><div><h3 class="card-title m-b-5"></h3></div></div></div></div>
        </div>
    </div>
    <div class="row" style="background: #F4F4F6;">
        <div class="col-lg-3">
            <div class="card">
                <div class="card-body">
                    <div class="d-flex">
                        <div class="m-r-20 align-self-center"><img src="{{ asset('/assets/ot/images/shouru.png') }}" style="width:90px;"; /></div>
                        <div class="align-self-center" style="font-weight: bold;color: #000;text-align:center;">
                            <h4 class="text-muted m-t-10 m-b-0"><span style="color:#000">昨日收入(元)</span></h4>
                            <h4 class="text-muted m-t-10 m-b-0"><span style="color:#000">￥@if(!$yesterdayOrderTotalPrice)0.00 @else{{$yesterdayOrderTotalPrice}}@endif</span></h4>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <div class="col-lg-3">
            <div class="card">
                <div class="card-body">
                    <div class="d-flex">
                        <div class="m-r-20 align-self-center"><img src="{{ asset('/assets/ot/images/dingdan.png') }}" style="width:90px;"; /></div>
                        <div class="align-self-center" style="font-weight: bold;color: #000;text-align:center;">
                            <h4 class="text-muted m-t-10 m-b-0"><span style="color:#000">昨日订单(笔)</span></h4>
                            <h4 class="text-muted m-t-10 m-b-0"><span style="color:#000">{{$yesterdayOrders}}</span></h4>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <div class="col-lg-3">
            <div class="card">
                <div class="card-body">
                    <div class="d-flex">
                        <div class="m-r-20 align-self-center"><img src="{{ asset('/assets/ot/images/shebei.png') }}" style="width:90px;"; /></div>
                        <div class="align-self-center" style="font-weight: bold;color: #000;text-align:center;">
                            <h4 class="text-muted m-t-10 m-b-0"><span style="color:#000">在线数(台)</span></h4>
                            <h4 class="text-muted m-t-10 m-b-0"><span style="color:#000">{{$onMachine}}</span></h4>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <div class="col-lg-3">
            <div class="card">
                <div class="card-body">
                    <div class="d-flex">
                        <div class="m-r-20 align-self-center"><img src="{{ asset('/assets/ot/images/zaixiantaishu.png') }}" style="width:90px;"; /></div>
                        <div class="align-self-center" style="font-weight: bold;color: #000;text-align:center;">
                            <h4 class="text-muted m-t-10 m-b-0"><span style="color:#000">设备总数(台)</span></h4>
                            <h4 class="text-muted m-t-10 m-b-0"><span style="color:#000">{{$downMachine}}</span></h4>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <div class="row" style="background: #F4F4F6;">
        <div class="col-md-12">
            <div class="card"><div class="card-body" style="background: #F4F4F6;"><div class="d-flex"><div><h3 class="card-title m-b-5"><span class="lstick"></span>快捷入口 </h3></div></div></div></div>
        </div>
    </div>
    <div class="row" style="background: #F4F4F6;">
        <!-- Column -->
        <div class="col-lg-3 col-md-6">
            <div class="card">
                <div class="card-body">
                    <div class="d-flex flex-row">
                        <div class="align-self-center"><img src="{{ asset('/assets/ot/images/ot1.png') }}" style="width:80px;";/></div>
                        <div class="m-l-10 align-self-center">
                            <h3 class="m-b-0"><a href="{{ route('admin.machines.index') }}" class="label label-success label-success">设备</a></h3> 
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <!-- Column -->
        <!-- Column -->
        <div class="col-lg-3 col-md-6">
            <div class="card" style="border-radius: 1em;">
                <div class="card-body">
                    <div class="d-flex flex-row">
                        <div class="align-self-center round-complete"><img src="{{ asset('/assets/ot/images/ot4.png') }}" style="width:80px;"; /></div>
                        <div class="m-l-10 align-self-center">
                            <h3 class="m-b-0"><a href="{{ route('admin.order.index') }}" class="label label-rounded label-success">订单</a></h3>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <!-- Column -->
        <!-- Column -->
        <div class="col-lg-3 col-md-6">
            <div class="card" style="border-radius: 1em;">
                <div class="card-body">
                    <div class="d-flex flex-row">
                        <div class="align-self-center round-success"><img src="{{ asset('/assets/ot/images/ot3.png') }}" style="width:80px;"; /></div>
                        <div class="m-l-10 align-self-center">
                            <h3 class="m-b-0"><a href="{{ route('admin.goods.index') }}" class="label label-rounded label-success">商品</a></h3>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <!-- Column -->
        <!-- Column -->
        <div class="col-lg-3 col-md-6">
            <div class="card" style="border-radius: 1em;">
                <div class="card-body">
                    <div class="d-flex flex-row">
                        <div class="align-self-center round-danger"><img src="{{ asset('/assets/ot/images/ot2.png') }}" style="width:80px;";/></div>
                        <div class="m-l-10 align-self-center">
                            <h3 class="m-b-0"><a href="{{ route('admin.statistics.outGoods') }}" class="label label-rounded label-success">缺货商品</a></h3>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <!-- Column -->
    </div>
</div>

@stop

@section('admin-js')

<!--morris JavaScript -->
<script src="{{ asset('assets/plugins/chartist-js/dist/chartist.min.js') }}"></script>
<script src="{{ asset('assets/plugins/chartist-plugin-tooltip-master/dist/chartist-plugin-tooltip.min.js') }}"></script>
@stop